The page performs its own name: scrolling goes deep, clicking seeks - #7
Merged
Conversation
The page now performs the two verbs in the tool's name. Scrolling descends a water column — the sea darkens, a depth gauge reads out the metres, and the light falls off the way it does underwater. Clicking sends a sonar pulse the whale answers with an echo. Also here, because the redesign exposed them: - Responsive repair at 390/430/768/834/1100/1440/1920, dark and light, plus reduced motion. Zero horizontal overflow at every width. `flex-wrap: nowrap` on the mobile masthead column is load-bearing and says so; the theme toggle moved out of `<nav>` because the phone breakpoint masks that subtree and takes absolutely positioned children with it. - DESIGN.md — the material contract: tokens, gestures, breakpoints. - TASTE.md gains two scars: three.js for the sea, and a depth effect with no readout. - site/bans.sh, wired into `make site-check`, so the bans are enforced rather than remembered. - 24 tests in site/waves.dom.test.js under `going deep` and `seek`. Based on ec0f5ce, so it does not yet carry the whale redraw from 35aaa39. Reconciling with main is the next commit, not this one.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The site's two verbs were in the name and nowhere else. Now scrolling
descends a water column — the surface climbs out of frame, the light
falls off, marine snow streams up past you, and a gauge in the margin
reads out the metres — and clicking sends a sonar pulse the whale
answers with an echo.
Also here, because the redesign exposed them
light, plus reduced motion. Zero horizontal overflow at every width.
flex-wrap: nowrapon the mobile masthead column is load-bearing andnow says so; the theme toggle moved out of
<nav>because the phonebreakpoint masks that subtree and takes absolutely positioned children
with it.
two gestures, the breakpoints.
with no readout.
make site-check, so the bans areenforced rather than remembered.
site/waves.dom.test.jsundergoing deepandseek.Reconciled with the whale redraw
This work was written against
ec0f5ceand predates35aaa39, sorebasing it onto main was a real merge rather than a formality. Both
feature sets survive intact —
site/waves.test.jsstill pins theredrawn body, mouth, fluke mark and favicon, and the deep/seek suite
passes beside it. The decisions worth knowing:
surfaceAttakes main's retuned chop factor (0.7) and thedepth-aware
layerBase. Same for the scroll handler (0.45 / 600) andthe chop attack (dt·3, decay 2.2) — the motion retune is kept, the
descent is added on top of it.
shallow()now copies by construction instead of listing fields.It was written when the state had no profile on it; main added
layers/narrowBoost/minSpan, and the whale reads the waterthrough
shallow()— so the old field list would have silently resetthe band whale's geometry the moment a band page had any depth.
the dark can swallow it as you descend. Then snow, then the ping,
which is the instrument and reads on top of everything.
sea_fixedand only that. A band page has nocolumn to descend, and a gauge there is an instrument wired to
nothing.
Verified
make checkgreen (Go + all five site test files +build.py --check+bans). Rendered in a real browser at 390/768/1440, dark and light: the
animation loop is live (frames climbing),
scrollWidth === clientWidthat every width, the gauge reads −905 m at the bottom of the home page
and is correctly
display: nonebelow 1100px, and the masthead markstill sits on the header rule.